import { calculateRowSpans, formatNumber } from '@/utils/util'
import { TableColumnsType } from 'antd'
import { DashboardSaleVO } from './types'
const getNodeWithPercent = (info: string | null | undefined | number) => {
  if (info === null || info === undefined) return '-'
  const numericValue = typeof info === 'string' ? Number(info.trim()) : Number(info)
  if (Number.isNaN(numericValue)) return '-'
  return <span style={{ color: numericValue >= 100 ? '#3f8600' : '#cf1322' }}>{info + '%'}</span>
}
export const useColumns = ({ tableData }: { tableData: DashboardSaleVO[] }): TableColumnsType<DashboardSaleVO> => {
  const firstSpan = calculateRowSpans(tableData || [], 'trackOrderPersonWorkId')

  return [
    {
      title: '供应链跟单',
      dataIndex: 'trackOrderPerson',
      key: 'trackOrderPerson',
      align: 'center',
      width: 100,
      onCell: (_, index) => {
        return { rowSpan: index != undefined ? firstSpan[index] : 0 }
      },
      render: (info) => info || '-',
    },
    {
      title: '大类',
      dataIndex: 'bigClassName',
      key: 'bigClassName',
      align: 'center',
      width: 100,
      render: (info) => info || '-',
    },
    {
      title: '返单量',
      dataIndex: 'returnOrderNum',
      key: 'returnOrderNum',
      align: 'center',
      width: 100,
      render: (info) => formatNumber(info),
    },
    {
      title: '目标天数',
      dataIndex: 'targetDayNum',
      key: 'targetDayNum',
      align: 'center',
      width: 100,
      render: (info) => <span style={{ color: 'var(--primary-color)' }}>{info || '-'}</span>,
    },
    {
      title: '实际达成天数',
      dataIndex: 'actualDayNum',
      key: 'actualDayNum',
      align: 'center',
      width: 100,
      render: (info) => <span style={{ fontWeight: 800 }}>{info || '-'}</span>,
    },
    {
      title: '达成率',
      dataIndex: 'achieveRate',
      key: 'achieveRate',
      align: 'center',
      width: 100,
      render: (info) => getNodeWithPercent(info),
    },
  ]
}
